<template>
	<div style="display: flex;flex-direction: column;">
		<div>
			<div>
				<img id="img" :src="logo">
				<p style="margin-left: 10px;float: left;text-align: left;size: a3;color: #BBBBBB;">|动态</p>
			</div>
			<div style="display: flex;float: right;margin-right: 10px;margin-top: 10px;">
				<div style="float: right;  height:30px;width: 50px; line-height: 20px;border-radius: 90px 0px 0px 0px;color: rgba(16, 16, 16, 100);border: 1px solid rgba(187, 187, 187, 100);">
					<router-link :to="{name: 'Forum'}">
						<p style="font-size: 10px;text-align: center;font-family: Roboto;margin-top: 7px;margin-left: 10px;color: rgba(0, 128, 255, 100);">
							论坛
						</p>
					</router-link>
				</div>
				
				<div style="float: right; width: 50px;height: 30px;line-height: 20px;border-radius: 0px 30px 30px 0px;background-color: rgba(0, 128, 255, 100);text-align: center;border: 1px solid rgba(187, 187, 187, 100);font-size: 10px;">
					<router-link :to="{name: 'SportExperience'}">
						<p style="font-size: 10px;text-align: center;font-family: Roboto;margin-top: 5px;color:#ffffff;">
							运动心得
						</p>
					</router-link>
				</div>
			</div>
		</div>
		<div>
			<router-view></router-view>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				logo:require("../assets/logo.png"),
				input: ''
			}
		}
	}
</script>


<style>
	
	
	#img{
		width: 110px;
		height: 30px;
		margin-top: 10px;
		margin-left: 10px;
		float: left;
	}
	.router-link-active{
		text-decoration: none;
	}
</style>
